<template>
  <h2>父级组件</h2>
  <h3>{{msg}}</h3>
  <button @click="msg += '==='">更新数据</button>
  <hr>
  <h3>{{msg1}}</h3>
  <Child :msg="msg" :msg1="msg1"  @changeToParent="changeParent"/>
</template>

<script lang="ts">
import { defineComponent, ref } from 'vue'
// 引入子级组件
import Child from './components/Child.vue'
export default defineComponent({
    name: 'App',
    //  注册组件
    components: {
        Child
    },
    setup() {
        // 定义一个Ref类型的数据
        const msg = ref('how are you ')
        const msg1 = ref('i am fine')
        function changeParent(txt:string) {
            msg.value += txt
        }
        return {
            msg,
            msg1,
            changeParent
        }
    }
})
</script>

<style>

</style>